import 'dart:ui' as ui;

import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';

import 'overscroll_config/overscroll_config.dart';

const double _defaultChartHeight = 200;
const double _defaultChartPaddingL = 20;
const double _defaultChartPaddingR = 20;
const double _defaultChartPaddingT = 20;
const double _defaultChartPaddingB = 20;
const Color _defaultAxisLineColor = Color(0xff000000);
const double _defaultAxisLineWidth = 1;

const double _lineStartXMargin = 60;
const double _lineStartYMargin = 10;
const double _lineEndYMargin = 30;
const double _lines = 5;
const double _yAxisTextSize = 14;

const double _pillarWidth = 30;
const double _pillarSpace = 30;

List<ChartData> chartData = [
  ChartData("一月份", "111", "111"),
  ChartData("一月份", "111", "111"),
  ChartData("一月份", "111", "111"),
  ChartData("一月份", "111", "111"),
  ChartData("一月份", "111", "111"),
  ChartData("一月份", "111", "111"),
  ChartData("一月份", "111", "111"),
];

class CustomCharts extends StatefulWidget {
  final double chartHeight;
  final double chartPaddingL;
  final double chartPaddingR;
  final double chartPaddingT;
  final double chartPaddingB;

  final Color axisLineColor;
  final double axisLineWidth;

  CustomCharts({
    Key key,
    this.chartHeight = _defaultChartHeight,
    this.chartPaddingL = _defaultChartPaddingL,
    this.chartPaddingR = _defaultChartPaddingR,
    this.chartPaddingT = _defaultChartPaddingT,
    this.chartPaddingB = _defaultChartPaddingB,
    this.axisLineColor = _defaultAxisLineColor,
    this.axisLineWidth = _defaultAxisLineWidth,
  }) : super(key: key);

  @override
  _CustomChartsState createState() => _CustomChartsState();
}

class _CustomChartsState extends State<CustomCharts> {
  final ScrollController _scrollController = new ScrollController();

  bool show = false;

  @override
  void initState() {
    _scrollController.addListener(() {
      // print(_scrollController.position.pixels);
    });
    super.initState();
  }

  @override
  Widget build(BuildContext context) {
    return Container(
      padding: EdgeInsets.only(
          left: widget.chartPaddingL,
          right: widget.chartPaddingR,
          top: widget.chartPaddingT,
          bottom: widget.chartPaddingB),
      height: widget.chartHeight,
      color: Colors.grey,
      child: CustomPaint(
        painter: AxisPainter(widget.axisLineColor, widget.axisLineWidth),
        child: Container(
          padding: EdgeInsets.only(
            left: _lineStartXMargin,
            right: _lineStartXMargin,
            top: _lineStartYMargin,
            bottom: 0,
          ),
          child: ScrollConfiguration(
            behavior: OverScrollBehavior(),
            child: SingleChildScrollView(
              physics: BouncingScrollPhysics(),
              controller: _scrollController,
              scrollDirection: Axis.horizontal,
              child: GestureDetector(
                onTapDown: (details) {
                  // print("onTapDown" + details.globalPosition.toString());
                },
                onTapUp: (details) {
                  print("onTapUp" + details.globalPosition.toString());
                  setState(() {
                    show = !show;
                  });
                },
                child: CustomPaint(
                  size: Size(500, 200),
                  painter: RectanglePainter(),
                ),
              ),
            ),
          ),
        ),
      ),
    );
  }
}

class AxisPainter extends CustomPainter {
  final Color axisLineColor;
  final double axisLineWidth;

  Paint axisPen;

  // 第一步
  final yAxisTextStyle = ui.ParagraphStyle(
    fontSize: _yAxisTextSize,
    maxLines: 1,
  );

  AxisPainter(this.axisLineColor, this.axisLineWidth) {
    axisPen = Paint()
      ..color = axisLineColor
      ..strokeWidth = axisLineWidth
      ..style = PaintingStyle.stroke
      ..isAntiAlias = true;
  }

  @override
  void paint(Canvas canvas, Size size) {
    final Rect rect = Rect.fromLTWH(0, 0, size.width, size.height);
    canvas.drawRect(rect, axisPen);

    double lineSpace = (size.height - _lineStartYMargin - _lineEndYMargin) / (_lines - 1);
    double lineWidth = (size.width - _lineStartXMargin * 2);
    for (int i = 0; i < _lines; i++) {
      canvas.drawLine(Offset(_lineStartXMargin, _lineStartYMargin + i * lineSpace),
          Offset(_lineStartXMargin + lineWidth, _lineStartYMargin + i * lineSpace), axisPen);

      final paragraphBuilder = ui.ParagraphBuilder(yAxisTextStyle)
        ..pushStyle(ui.TextStyle(color: Colors.black))
        ..addText('1.0万/平');
      var paragraph = paragraphBuilder.build();
      paragraph.layout(ui.ParagraphConstraints(width: _lineStartXMargin));
      canvas.drawParagraph(paragraph, Offset(0, (_lineStartYMargin / 10) + i * lineSpace));
    }
  }

  @override
  bool shouldRepaint(covariant CustomPainter oldDelegate) {
    return true;
  }
}

class RectanglePainter extends CustomPainter {
  final Paint painter = Paint()
    ..color = Colors.orange
    ..strokeWidth = 2.0
    ..style = PaintingStyle.stroke
    ..isAntiAlias = true;

  @override
  void paint(Canvas canvas, Size size) {
    double lineSpace = (size.height - _lineStartYMargin - _lineEndYMargin) / (_lines - 1);

    for (int i = 0; i < chartData.length; i++) {
      double height = 100;
      double top = _lineStartYMargin + (_lines - 1) * lineSpace - height;
      final Rect pillar = Rect.fromLTWH(_pillarSpace * (i + 1) + i * _pillarWidth, top, _pillarWidth, height);
      canvas.drawRect(pillar, painter);
    }
  }

  @override
  bool shouldRepaint(RectanglePainter oldDelegate) {
    print("shouldRepaint");
    return true;
  }
}

class ChartData {
  String month;
  String price;
  String dealCount;

  ChartData(this.month, this.price, this.dealCount);
}
